/**
* 单词跟读积分榜
*/
<template>

	<view class="page">
		<view class="flex-item">
			<pointsItem class="mb-20" title="游戏得分" :value="params.feshu"></pointsItem>
			<pointsItem class="mb-20" title="答题速度" :value="params.time"></pointsItem>
			<pointsItem title="游戏积分" :value="params.points"></pointsItem>
		</view>
		<button class="bg-primary text-white save" @click="save">领取积分</button>
	</view>
</template>

<script setup>
	import { ref } from 'vue';
import pointsItem from '../points/componenst/item.vue'

	import {onLoad} from '@dcloudio/uni-app'
import { toast } from 'luoyu-uni-utils';
import {useUserStore} from '@/store/modules/user.js'
	
	const params = ref({})
	const userStore = useUserStore()
	
	// 领取积分
	const save = () =>{
		const oldpoints =  userStore.userPoints
		const points = params.value.points || 0
		if(oldpoints) {
			const newPoints =  oldpoints + parseFloat(points)
			uni.setStorageSync('userPoints',newPoints)
		}else {
			uni.setStorageSync('userPoints',points)
		}
		toast("领取完成")
		setTimeout(() =>{
			uni.reLaunch({
				url:"/pages/index/index"
			})
		},1500)
	}
	
	onLoad((query) =>{
		params.value = query
		params.value.time = decodeURIComponent(query.time)
	})
</script>

<style lang="scss">
	page {
		background-color: #f3f1c3;
	}

	$radius: 15px 15px 0 0;

	.page {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		align-content: center;
		.flex-item {
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			align-content: center;
			padding-top: 200rpx;
		}
		.save {
			position: fixed;
			bottom: 150rpx;
			width: 350rpx;
			left: 50%;
			transform: translateX(-50%);
		}

	}
</style>